<!-- 出库(仓库端或货主端)、出库复核(货主端)、提交签收(承运商)、签收复核(货主端) -->
<template>
  <div class="border border-solid border-black p-[10px] pb-[0] my-[20px]">
    <div class="flex">
      <div>{{ title }}</div>
      <BasicUploadImage
        contentText="请上传出库确认回执"
        :params="params"
        :fileLists="fileList"
        :showRemoveIcon="false"
        :showUpload="false"
      />
      <BasicUploadImage contentText="请上传出库确认回执" :params="params" :fileLists="refileList" />
    </div>
    <Form
      class="flex flex-wrap"
      ref="formRef"
      :label-col="{ style: { width: '80px' } }"
      :model="formState"
    >
      <FormItem v-if="formState.shippingType == 8" class="w-[33%]" label="快递单号" disabled>
        <Input class="w-[100%]" v-model:value="formState.expressNo" />
      </FormItem>
    </Form>
  </div>
</template>
<script lang="ts" setup>
  import { ref, defineEmits } from 'vue';
  import { message, Form, FormItem } from 'ant-design-vue';
  import BasicUploadImage from '@/components/UploadImage/BasicUploadImage.vue';
  import { postOutBoundRecheck, postInBoundRecheck } from '@/api/waybillManagement/index';

  import { getUserFiles } from '@/api/common';

  const emit = defineEmits(['onSuccess', 'onFailed']);

  const params = ref({
    configCode: 'eslogis_order',
    label: 'outboundCheck',
    batchId: '',
  });
  // 复核之前上传的文件
  const fileList = ref([]);
  // 复核上传的文件
  const refileList = ref([]);

  const title = ref('');

  const formState = ref({
    shippingOrderId: 0,
    fileLabel: '',
    expressNo: '',
    shippingType: 0,
  });

  const initFormState = async (queryParams) => {
    console.log('🚀 ~ initFormState ~ queryParams:', queryParams);
    params.value.batchId = queryParams.batchId;
    formState.value = {
      shippingOrderId: queryParams.shippingOrderId,
      fileLabel: queryParams.fileLabel,
      shippingType: queryParams.shippingType,
      expressNo: queryParams.expressNo,
    };
    title.value = queryParams.fileLabel === 'outboundCheck' ? '出库确认回执：' : '入库确认回执：';

    const res = await getUserFiles({
      ...params.value,
      label: queryParams.fileLabel === 'outboundCheck' ? 'outbound' : 'inbound',
    });
    fileList.value = res.filter((item) => {
      if (item.label === 'outbound') {
        return item;
      }
    });
    refileList.value = res.filter((item) => {
      if (item.label === 'outboundCheck') {
        return item;
      }
    });
    console.log('🚀 ~ res.forEach ~ fileList:', fileList);
  };

  const Return = async (rejectRemark) => {
    try {
      const params = {
        ...formState.value,
        rejectRemark,
        isPass: false,
      };
      if (formState.value.fileLabel === 'outboundCheck') {
        await postOutBoundRecheck(params);
      } else {
        await postInBoundRecheck(params);
      }

      message.success('处理成功');
      emit('onSuccess');
    } catch (error) {
      message.error(error.message);
      emit('onFailed');
    }
  };

  const Commit = async () => {
    try {
      const params = {
        ...formState.value,
        isPass: true,
      };
      if (formState.value.fileLabel === 'outboundCheck') {
        await postOutBoundRecheck(params);
      } else {
        await postInBoundRecheck(params);
      }
      message.success('处理成功');
      emit('onSuccess');
    } catch (error) {
      emit('onFailed');
      message.error(error.message);
    }
  };

  defineExpose({
    initFormState,
    Commit,
    Return,
  });
</script>
